<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title></title>

		<link rel="stylesheet" href="${pageContext.request.contextPath}/main/css/amazeui.min.css">
		<link rel="stylesheet" href="${pageContext.request.contextPath}/main/css/admin.css">
		<link rel="stylesheet" href="${pageContext.request.contextPath}/main/css/app.css">
  <style>
       .supplier-chain {
        display: flex;
        align-items: center;
    }
  
    .enterprise {
        width: 100px;
        height: 50px;
        position: relative;
        display: inline-block;
        text-align: center;
        margin: 30px;
        font-size: 16px;
        font-weight: bold;
    }
  
    .enterprise:after {
        content: "";
        position: absolute;
        width: 100%;
        height: 2px;
        background: black;
        top: 50%;
        left: 100%;
        transform: translate(0px, -50%);
    }
  
    .enterprise:last-child:after {
        display: none; /* 不给最后一个企业添加连接线 */
    }
    
    .in-status-0 {
      background-color: gray;
    }
    
    .status-0 {
      background-color: red;
      color: white;
    }
    
    .role-1 {
      background-color: orange;
    }
    
    .default {
      background-color: green;
      color: white;
    }
    
    .enterprise-inner {
      width: 100%;
      height: 100%;
      box-sizing: border-box;
      border: 2px solid black;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    
    .box {
      width: 10px;
      height: 10px;
      display: inline-block;
      margin-right: 10px;
    }
  </style>
	</head>

	<body>

		<div class="am-cf admin-main">
			<!-- content start -->
			<div class="admin-content">
				<div class="admin-content-body">
					<div class="am-cf am-padding am-padding-bottom-0">
						<div class="am-fl am-cf">
							<strong class="am-text-primary am-text-lg"> </strong><small>
								<i class="icon-home"></i> &gt; 首页 &gt; 供应链展示	</small>
						</div>
					</div>
					<hr>
					
	<div>
        <div class="box" style="background-color: red;"></div>
        <span>代表经营状态不良;</span>
    </div>
    <div>
        <div class="box" style="background-color: gray;"></div>
        <span>代表未准入;</span>
    </div>
    <div>
        <div class="box" style="background-color: orange;"></div>
        <span>代表核心企业;</span>
    </div>
    <div>
        <div class="box" style="background-color: green;"></div>
        <span>代表经营正常的链条企业;</span>
    </div>
    <div>
        <span>没有注册的企业不显示;</span>
    </div>
					
<c:forEach var="supplyChain" items="${SupplyChainList}">
 <div class="supply-chain">
      <c:forEach var="enterprise" items="${supplyChain.ls}">
        <div class="enterprise ${enterprise.status != 0 ? 'status-0' :
                (enterprise.inStatus != 2 ? 'in-status-0' :
                (enterprise.role == 1 ? 'role-1' : 'default'))}">
          <div class="enterprise-inner" onclick="searchEnterpriseMsg('${enterprise.entNo}','${enterprise.role}')">
            ${enterprise.name}
          </div>
        </div>
      </c:forEach>
    </div>
</c:forEach>

				</div>
				<!-- content end -->
			</div>
		</div>
		<script>
		function searchEnterpriseMsg(entNo,role) {
		    // 执行你的操作
		    console.log("查询企业信息：" + entNo);
		    
		    // 可选：阻止链接的默认行为（跳转）
		    var url = "${pageContext.request.contextPath}/SearchEntByEntNoController";
		    // 拼接URL和请求参数
		    var fullUrl = url + "?entNo=" + entNo + "&role=" + role;
		    // 跳转到指定URL
		    window.location.href = fullUrl;
		
		}
		</script>

		<!--[if lt IE 9]>
<script src="js/jquery.min.js"></script>
<script src="js/modernizr.js"></script>
<script src="js/amazeui.ie8polyfill.min.js"></script>
<![endif]-->

		<!--[if (gte IE 9)|!(IE)]><!-->
		<script src="js/jquery-1.11.3.min.js"></script>
		<!--<![endif]-->
		<script type="text/javascript" src="js/plugs.js"></script>
		<script>
			$(function() {
				$(".btnAdd").click(function() {
					$.jq_Panel({
						title: "添加用户",
						url: "addUser.html",
						iframeWidth: 800,
						iframeHeight: 600,
					});
				});

				$(".btnEdit").click(function() {
					$.jq_Panel({
						title: "编辑用户",
						url: "addUser.html",
						iframeWidth: 800,
						iframeHeight: 600,
					});

				});

			});
		</script>
	</body>

</html>